<template>
	<image :src="src" mode="widthFix" :class="type" :style="getStyle" @click="clickEvent"></image>
</template>

<script>
	export default {
		props: {
			size: {
				type: [String, Number],
				default: 200
			},
			radius:{
				type: [String, Number],
				default: 100
			},
			right: {
				type: [String, Number],
				default: 20
			},
			src: {
				type: String,
				default: "",
			},
			type: {
				type: String,
				default: "rounded"
			},
			clickType: {
				type: String,
				default: "none"
			}
		},
		computed: {
			getStyle() {
				return `width: ${this.size}rpx; height:${this.size}rpx; right: ${this.right}rpx`
			}
		},
		methods: {
			clickEvent() {
				switch (this.clickType) {
					case 'navigate':
						uni.navigateTo({
							url: '/pages/mail/user-base/user-base'
						})
						break;
					default:
						this.$emit('click')
						break;
				}
			}
		}
	}
</script>

<style>
</style>
